<template>
  <div>
    <my-form-drawer :title="title" :width="450" :visible="visible" @ok="save" @cancel="onClose">
      <a-form-model ref="ipForm" :model="form" :rules="rules">
        <a-form-model-item label="ip地址" prop="ipAddr">
          <a-input v-model="form.ipAddr" />
        </a-form-model-item>
      </a-form-model>
    </my-form-drawer>
  </div>
</template>
<script>
import MyFormDrawer from '@/components/drawer/MyFormDrawer';
import { add } from '@/services/ipWhite'
import {rule} from '@/utils/validateRules';
export default {
  name: 'IPwhiteEdit',
  components: { MyFormDrawer },
  data() {
    return {
      title: '新增Ip',
      visible: false,
      action: 0, //1:编辑，0：新增
      form: {
        id: '',
        ipAddr: ''
      },
      rules: {
        ipAddr: [
          { required: true, message: 'ip不能为空', trigger: 'blur' },
          { trigger: ["change", "blur"], validator: rule.validatorIP }
        ]
      }
    };
  },
  methods: {
    showInfo(state, action, data) {
      this.visible = state;
      this.action = action;
      //1:编辑，0：新增
      if (action == 1) {
        this.title = '编辑Ip';
        Object.keys(this.form).forEach(key => (this.form[key] = data[key]));
      } else {
        this.title = '新增Ip';
        Object.keys(this.form).forEach(key => (this.form[key] = ''));
      }
    },
    save() {
      this.$refs.ipForm.validate(vaild => {
        if (!vaild) {
          return false;
        }
        if (vaild) {
          if (this.action == 0) {
            add(this.form).then(res => {
              if (res.data.code === 0) {
                this.$message.success('新增成功');
                this.$emit('refresh');
                this.visible = false;
              }
            });
          }
        }
      });
    },
    onClose() {
      this.visible = false;
      this.$refs['ipForm'].resetFields(); //清除表单校验状态~
      Object.keys(this.form).forEach(key => (this.form[key] = ''));
    }
  }
};
</script>
<style lang="less" scoped></style>
